<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<style>
		.triangle {
			height: 0;
			width: 0;
			border-width: 0 150px 260px 150px;
			border-style: solid;
			border-color: transparent transparent pink transparent;
		}

		.circle {
			width: 0;
			height: 0;
			border-width: 50px;
			border-style: solid;
			border-color: orange;
			border-radius: 50%;
		}

		.ellipse {
			width: 0;
			height: 0;
			border-width: 50px 80px;
			border-style: solid;
			border-color: burlywood;
			border-radius: 80px/50px;
		}

		.aa {
			width: 0;
			height: 0;
			border-width: 50px 80px;
			border-style: solid;
			border-color: orchid;
			border-radius: 50% / 100% 100% 0 0;
		}

		div {
			margin: 30px auto;
		}

		.bb {

			width: 0;
			height: 0;
			border-width: 50px 80px;
			border-style: solid;
			border-color: orchid;
			border-radius: 50% / 0 0 100% 100%;
		}

		.cc {
			width: 0;
			height: 0;
			border-width: 50px 80px;
			border-style: solid;
			border-color: orchid;
			border-radius: 100% 0 0 100% / 50%;
		}

		.dd {
			width: 0;
			height: 0;
			border-width: 50px 80px;
			border-style: solid;
			border-color: orchid;
			border-radius: 0 100% 100% 0 / 50%;
		}

		.ee {
			width: 0;
			height: 0;
			border-width: 100px;
			border-style: solid;
			border-color: transparent transparent #f00 transparent;
			border-radius: 50%;
		}

		.ff {
			width: 0;
			height: 0;
			border-width: 50px;
			border-style: solid;
			border-color: #f00;
			border-radius: 100% 0 0 0;
		}
	</style>
	<body>
		<div class="triangle"></div>
		<div class="circle"></div>
		<div class="ellipse"></div>
		<div class="aa"></div>
		<div class="bb"></div>
		<div class="cc"></div>
		<div class="dd"></div>
		<div class="ee"></div>
		<div class="ff"></div>
	</body>
</html>
